
<!DOCTYPE html> 
<html> 
 
  <head> 
    <title>Backbone Demo: Todos</title> 
    <link href="/media/css/todo.css" media="all" rel="stylesheet" type="text/css"/> 
    <script src="/media/js/json2.js"></script> 
    <script src="/media/js/jquery-1.4.2.js"></script> 
    <script src="/media/js/underscore-1.1.3.js"></script> 
    <script src="/media/js/backbone.js"></script> 
    <script src="/media/js/todos.js"></script> 
  </head> 
 
  <body> 
 
    <!-- Todo App Interface --> 
 
    <div id="todoapp"> 
 
      <div class="title"> 
        <h1>Todos</h1> 
      </div> 
 
      <div class="content"> 
 
        <div id="create-todo"> 
          <input id="new-todo" placeholder="What needs to be done?" type="text" /> 
          <span class="ui-tooltip-top" style="display:none;">Press Enter to save this task</span> 
        </div> 
 
        <div id="todos"> 
          <ul id="todo-list"></ul> 
        </div> 
 
        <div id="todo-stats"></div> 
 
      </div> 
 
    </div> 
 
    <ul id="instructions"> 
      <li>Double-click to edit a todo.</li> 
    </ul> 
 
    <div id="credits"> 
      Backbone.js demo modified by
      <a href="http://www.theokayblog.com/">Victor Goh</a>. 
      <br /> 
	  Source code available at <a href="http://code.google.com/p/todo-backbone-kay/">Google Project Hosting</a>.
      <br /> 
      Original creator <a href="http://jgn.me/">J&eacute;r&ocirc;me Gravel-Niquet</a> 
	  <br /><br /> 
	 Powered by: <br />
	 <a href="http://documentcloud.github.com/backbone/"><img src="/media/img/backbone-logo-na.png" 
	alt="Backbone.js" title="Backbone.js" /></a><a href="http://code.google.com/p/kay-framework/"><img src="/media/img/kay-logo.png" alt="Kay-Framework" 
	title="Kay Framework" /></a><a href="http://code.google.com/appengine/"><img src="http://code.google.com/appengine/images/appengine-noborder-120x30.gif" 
	alt="Google App Engine" title="Google App Engine" /></a>
    </div> 
 
    <!-- Templates --> 
 
    <script type="text/template" id="item-template"> 
      <div class="todo <%= done ? 'done' : '' %>">
        <div class="display">
          <input class="check" type="checkbox" <%= done ? 'checked="checked"' : '' %> />
          <div class="todo-content"></div>
          <span class="todo-destroy"></span>
        </div>
        <div class="edit">
          <input class="todo-input" type="text" value="" />
        </div>
      </div>
    </script> 
 
    <script type="text/template" id="stats-template"> 
      <% if (total) { %>
        <span class="todo-count">
          <span class="number"><%= remaining %></span>
          <span class="word"><%= remaining == 1 ? 'item' : 'items' %></span> left.
        </span>
      <% } %>
      <% if (done) { %>
        <span class="todo-clear">
          <a href="#">
            Clear <span class="number-done"><%= done %></span>
            completed <span class="word-done"><%= done == 1 ? 'item' : 'items' %></span>
          </a>
        </span>
      <% } %>
    </script> 
 
  </body> 
 
</html>